<template>
  <div class="city-list">
    <van-index-bar :index-list="indexList" v-for="(item,index) in indexList" :key="index">

      <van-index-anchor :index="item"  />
      <van-cell title="文本" />
      <van-cell title="文本" />
      <van-cell title="文本" />

    </van-index-bar>
  </div>
</template>

<script>
export default {
  name: 'city-list',
  data() {
    return {
      indexList: [
        '#',
        '热',
        'A',
        'B',
        'C',
        'D',
        'F',
        'G',
        'H',
        'J',
        'K',
        'L',
        'M',
        'N',
        'Q',
        'S',
        'T',
        'W',
        'X',
        'Y',
        'Z'
      ]
    }
  }
}
</script>

<style scoped lang="less">
.kong {
  height: 46px;
}
.city-list {
  margin-top: 46px;
  overflow-y: auto;
}
::v-deep .van-index-bar__sidebar {
  position: fixed;
  right: 0px;
  top: 330px;
  > span {
    margin-top: 12px;
    font-size: 14px;
    // font-weight: 550;
    font-family: "宋体";
  }
}
</style>
